<template>
  <!-- 意见反馈 -->
  <div class="feedback">
    <returnPage></returnPage>
    <van-cell title="反馈类型" />
    <van-field
      readonly
      clickable
      :value="value"
      placeholder="选择类型"
      @click="showPicker = true"
      is-link
    />
    <van-popup v-model="showPicker" round position="bottom">
      <van-picker
        show-toolbar
        :columns="columns"
        @cancel="showPicker = false"
        @confirm="onConfirm"
      />
    </van-popup>
    <van-cell title="反馈内容" />
    <van-field
      v-model="message"
      rows="10"
      autosize
      type="textarea"
      maxlength="500"
      placeholder="对我们网站、商品、服务，你还有什么建议吗？你还希望在商城上买到什么？请告诉我们..."
      show-word-limit
    />
    <van-cell title="联系方式" />
    <van-cell-group>
      <van-field
        v-model="values"
        placeholder="请输入联系电话，方便我们与您联系"
      />
    </van-cell-group>
    <van-button type="primary" size="large">大号按钮</van-button>
  </div>
</template>

<script>
export default {
  name: 'feedback',
  components: {},
  data () {
    return {
      value: '',
      values: '',
      message: '',
      showPicker: false,
      columns: ['商品相关', '功能异常', '优化建议', '其他']
    }
  },
  // 计算属性
  computed: {},
  watch: {},
  mounted () {},
  methods: {
    onConfirm (value) {
      this.value = value
      this.showPicker = false
    }
  }
}
</script>

<style lang="scss" scoped></style>
